// 更新当前时间
function updateCurrentTime() {
    const now = new Date();
    const options = {
        year: 'numeric',
        month: '2-digit',
        day: '2-digit',
        hour: '2-digit',
        minute: '2-digit',
        second: '2-digit',
        hour12: false
    };
    document.getElementById('current-time').textContent = now.toLocaleString('zh-CN', options);
}

// 初始化侧边栏功能
function initSidebar() {
    // 侧边栏切换
    document.querySelector('.toggle-sidebar').addEventListener('click', function() {
        const sidebar = document.querySelector('.sidebar');
        const mainContent = document.querySelector('.main-content');

        sidebar.classList.toggle('collapsed');
        mainContent.classList.toggle('expanded');

        if (sidebar.classList.contains('collapsed')) {
            sidebar.style.width = '70px';
            mainContent.style.marginLeft = '70px';

            // 隐藏菜单文本
            document.querySelectorAll('.menu-text, .menu-group-title').forEach(el => {
                el.style.display = 'none';
            });

            // 居中菜单图标
            document.querySelectorAll('.menu-item').forEach(item => {
                item.style.justifyContent = 'center';
            });

            // 隐藏侧边栏标题
            document.querySelector('.sidebar-header h2').style.display = 'none';
        } else {
            sidebar.style.width = '250px';
            mainContent.style.marginLeft = '250px';

            // 显示菜单文本
            document.querySelectorAll('.menu-text, .menu-group-title').forEach(el => {
                el.style.display = 'block';
            });

            // 恢复菜单项布局
            document.querySelectorAll('.menu-item').forEach(item => {
                item.style.justifyContent = 'flex-start';
            });

            // 显示侧边栏标题
            document.querySelector('.sidebar-header h2').style.display = 'block';
        }
    });

    // 菜单项点击事件
    document.querySelectorAll('.menu-item').forEach(item => {
        item.addEventListener('click', function() {
            // 移除所有active类
            document.querySelectorAll('.menu-item').forEach(i => {
                i.classList.remove('active');
            });
            // 添加active类到当前项
            this.classList.add('active');

            // 更新页面标题
            const pageTitle = this.querySelector('.menu-text').textContent;
            document.querySelector('.page-title').textContent = pageTitle;

            // 在实际应用中，这里可以加载对应页面的内容
            console.log(`切换到页面: ${pageTitle}`);
        });
    });
}

// 初始化图表
function initCharts() {
    // 出入库订单趋势图
    const orderTrendCtx = document.getElementById('orderTrendChart').getContext('2d');
    const orderTrendChart = new Chart(orderTrendCtx, {
        type: 'line',
        data: {
            labels: ['9月7日', '9月8日', '9月9日', '9月10日', '9月11日', '9月12日', '9月13日'],
            datasets: [
                {
                    label: '入库订单',
                    data: [320, 302, 301, 334, 390, 330, 320],
                    borderColor: '#2c80ff',
                    backgroundColor: 'rgba(44, 128, 255, 0.1)',
                    tension: 0.4,
                    fill: true
                },
                {
                    label: '出库订单',
                    data: [520, 532, 501, 534, 590, 530, 520],
                    borderColor: '#34c38f',
                    backgroundColor: 'rgba(52, 195, 143, 0.1)',
                    tension: 0.4,
                    fill: true
                }
            ]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            plugins: {
                legend: {
                    position: 'top',
                }
            },
            scales: {
                y: {
                    beginAtZero: true,
                    title: {
                        display: true,
                        text: '订单数量'
                    }
                }
            }
        }
    });

    // 订单状态分布图
    const orderStatusCtx = document.getElementById('orderStatusChart').getContext('2d');
    const orderStatusChart = new Chart(orderStatusCtx, {
        type: 'doughnut',
        data: {
            labels: ['已完成', '处理中', '待处理', '异常'],
            datasets: [{
                data: [45, 30, 15, 10],
                backgroundColor: [
                    '#34c38f',
                    '#2c80ff',
                    '#f1b44c',
                    '#f46a6a'
                ],
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            plugins: {
                legend: {
                    position: 'bottom'
                }
            }
        }
    });

    // 设备运行状态图
    const deviceStatusCtx = document.getElementById('deviceStatusChart').getContext('2d');
    const deviceStatusChart = new Chart(deviceStatusCtx, {
        type: 'bar',
        data: {
            labels: ['AGV小车', '输送线', '堆垛机', '分拣机', '包装机', '码垛机'],
            datasets: [{
                label: '运行率 (%)',
                data: [92, 88, 95, 85, 90, 87],
                backgroundColor: '#2c80ff',
                borderColor: '#2c80ff',
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            scales: {
                y: {
                    beginAtZero: true,
                    max: 100,
                    title: {
                        display: true,
                        text: '运行率 (%)'
                    }
                }
            }
        }
    });

    // 仓库吞吐量排行图
    const warehouseRankCtx = document.getElementById('warehouseRankChart').getContext('2d');
    const warehouseRankChart = new Chart(warehouseRankCtx, {
        type: 'bar',
        data: {
            labels: ['北京仓', '上海仓', '广州仓', '成都仓', '武汉仓'],
            datasets: [
                {
                    label: '入库量',
                    data: [3200, 2987, 2654, 2432, 1987],
                    backgroundColor: '#2c80ff'
                },
                {
                    label: '出库量',
                    data: [3567, 3123, 2876, 2543, 2134],
                    backgroundColor: '#34c38f'
                }
            ]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            indexAxis: 'y',
            scales: {
                x: {
                    beginAtZero: true,
                    title: {
                        display: true,
                        text: '订单数量'
                    }
                }
            }
        }
    });

    return {
        orderTrendChart,
        orderStatusChart,
        deviceStatusChart,
        warehouseRankChart
    };
}

// 初始化筛选功能
function initFilters() {
    // 查询按钮事件
    document.querySelector('.btn-primary').addEventListener('click', function() {
        // 在实际应用中，这里会发送筛选请求并更新数据
        console.log('执行查询操作');

        // 模拟数据更新
        const metrics = document.querySelectorAll('.metric-value');
        metrics[0].textContent = Math.floor(Math.random() * 2000 + 1000).toLocaleString();
        metrics[1].textContent = Math.floor(Math.random() * 3000 + 1500).toLocaleString();
        metrics[2].textContent = (Math.random() * 5 + 94).toFixed(1) + '%';
        metrics[3].textContent = (Math.random() * 10 + 85).toFixed(1) + '%';
    });

    // 重置按钮事件
    document.querySelectorAll('.btn-outline')[0].addEventListener('click', function() {
        const selects = document.querySelectorAll('.filter-control');
        selects.forEach(select => {
            select.selectedIndex = 1; // 重置为第二个选项（本周）
        });
        console.log('筛选条件已重置');
    });

    // 导出按钮事件
    document.querySelectorAll('.btn-outline')[1].addEventListener('click', function() {
        console.log('执行导出操作');
        // 在实际应用中，这里会触发数据导出
        alert('数据导出功能将在实际部署时实现');
    });

    // 保存筛选方案按钮事件
    document.querySelectorAll('.btn-outline')[2].addEventListener('click', function() {
        console.log('保存筛选方案');
        // 在实际应用中，这里会保存当前的筛选条件
        alert('筛选方案已保存');
    });
}

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', function() {
    // 初始化时间显示
    setInterval(updateCurrentTime, 1000);
    updateCurrentTime();

    // 初始化侧边栏
    initSidebar();

    // 初始化图表
    const charts = initCharts();

    // 初始化筛选功能
    initFilters();

    console.log('LDMS系统初始化完成');
});